import { Event, publishEvent } from '@/stores/event';
import { createRouter, createWebHistory, RouterView } from 'vue-router';

const AppView = () => import('@/views/agriculture/index.vue');

const HomeView = () => import('@/views/agriculture/PlatePage/Home/index.vue');
const PoliciesView = () => import('@/views/agriculture/PlatePage/policiesRegulations/index.vue');
const LinkView = () => import('@/views/agriculture/PlatePage/relatedLinks/index.vue');

const ProjectView = () => import('@/views/agriculture/PlatePage/projectOverview/index.vue');
const XMDetailPage = () =>
  import('@/views/agriculture/PlatePage/projectOverview/_/DetailsPage/index.vue');

const KnowledgeView = () => import('@/views/agriculture/PlatePage/scientificKnowledge/index.vue');
const KPDetailPage = () =>
  import('@/views/agriculture/PlatePage/scientificKnowledge/_/DetailsPage/index.vue');

const DynamicView = () => import('@/views/agriculture/PlatePage/industryDynamics/index.vue');
const HYDetailPage = () =>
  import('@/views/agriculture/PlatePage/industryDynamics/_/DetailsPage/index.vue');

const MicroFilmView = () => import('@/views/agriculture/PlatePage/microfilmPictures/index.vue');
const WYSDetailPage = () =>
  import('@/views/agriculture/PlatePage/microfilmPictures/_/DetailsPage/index.vue');

const CourseView = () => import('@/views/agriculture/PlatePage/trainingCourses/index.vue');
const PXDetailPage = () =>
  import('@/views/agriculture/PlatePage/trainingCourses/_/DetailsPage/index.vue');

const AchievementView = () => import('@/views/agriculture/PlatePage/achievementsDisplay/index.vue');
const CGDetailPage = () =>
  import('@/views/agriculture/PlatePage/achievementsDisplay/_/DetailsPage/index.vue');

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      name: 'home',
      redirect: '/agriculture',
    },
    {
      path: '/agriculture',
      name: 'agriculture',
      component: AppView,
      children: [
        {
          path: '',
          name: 'agriculture-home',
          component: HomeView,
        },
        {
          path: 'ProjectView',
          component: { render: () => h(RouterView) },
          children: [
            {
              path: '',
              component: ProjectView,
            },
            {
              path: ':id',
              name: 'XMDetailPage',
              component: XMDetailPage,
              props: true,
            },
          ],
        },
        {
          path: 'KnowledgeView',
          component: { render: () => h(RouterView) },
          children: [
            {
              path: '',
              component: KnowledgeView,
            },
            {
              path: ':id',
              name: 'KPDetailPage',
              component: KPDetailPage,
              props: true,
            },
          ],
        },
        {
          path: 'PoliciesView',
          name: 'PoliciesView',
          component: PoliciesView,
        },
        {
          path: 'DynamicView',
          component: { render: () => h(RouterView) },
          children: [
            {
              path: '',
              component: DynamicView,
            },
            {
              path: ':id',
              name: 'HYDetailPage',
              component: HYDetailPage,
              props: true,
            },
          ],
        },
        {
          path: 'CourseView',
          component: { render: () => h(RouterView) },
          children: [
            {
              path: '',
              component: CourseView,
            },
            {
              path: ':id',
              name: 'PXDetailPage',
              component: PXDetailPage,
              props: true,
            },
          ],
        },
        {
          path: 'LinkView',
          name: 'LinkView',
          component: LinkView,
        },
        {
          path: 'AchievementView',
          component: { render: () => h(RouterView) },
          children: [
            {
              path: '',
              component: AchievementView,
            },
            {
              path: ':id',
              name: 'CGDetailPage',
              component: CGDetailPage,
              props: true,
            },
          ],
        },
        {
          path: 'MicroFilmView',
          component: { render: () => h(RouterView) },
          children: [
            {
              path: '',
              component: MicroFilmView,
            },
            {
              path: ':id',
              name: 'WYSDetailPage',
              component: WYSDetailPage,
              props: true,
            },
          ],
        },
      ],
    },
  ],
  scrollBehavior() {
    return { top: 425 };
  },
});

router.afterEach((to) => {
  if (import.meta.env.PROD) {
    const _hmt = (window as any)._hmt;
    if (_hmt && Array.isArray(_hmt)) {
      _hmt.push(['_trackPageview', to.fullPath]);
    }
  }
});

// 进度指示器
router.beforeEach(() => {
  publishEvent(Event.showTopLoader);
});
router.afterEach(() => {
  publishEvent(Event.hideTopLoader);
});

export default router;
